<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head>
	<meta charset="UTF-8"/>
	<title>仲裁</title>
	<link th:href="@{css/fonts.css}" rel="stylesheet"/>
	<style>
		body {
			background-color: #1A2332;
			color: #E0E0E0;
			margin: 0;
			padding: 20px;
			line-height: 1.6;
			-fs-pdf-font-embed: embed;
		}

		h1 {
			color: #4A90E2;
			font-size: 32px;
			margin-bottom: 20px;
			text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
		}

		.arbitration-container {
			background-color: #2D3B4D;
			border-radius: 12px;
			border: 2px solid #3C4B5E;
			padding: 20px;
			margin-bottom: 20px;
			box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
		}

		table {
			width: 100%;
			border-collapse: separate;
			border-spacing: 0 10px;
		}

		td {
			padding: 15px;
			vertical-align: middle;
		}

		ul {
			list-style-type: none;
			padding: 0;
			margin: 0;
		}

		li {
			margin-bottom: 8px;
			font-size: 18px;
		}

		.mission-type {
			color: #FF7542;
			font-weight: bold;
		}

		.mission-node {
			color: #7595FF;
		}

		.mission-etc {
			color: #FF7474;
		}

		.mission-time {
			color: #A0B1C5;
			font-size: 14px;
		}

		img {
			max-width: 60px;
			height: auto;
			display: block;
			margin-left: auto;
			-fs-fit-images-to-width: 60px;
		}

		hr {
			border: 0;
			height: 1px;
			background: linear-gradient(to right, transparent, #4A90E2, transparent);
			margin: 20px 0;
		}
	</style>
</head>


<body>
<!--
生成图片的宽度
-->
<w>
	1290
</w>
<h1>仲裁</h1>
<hr/>
<div class="arbitration-container">
	<table>
		<tr>
			<td style="width: 80%;">
				<ul>
					<li class="mission-type" th:text="${arbit.type}+' - '+${arbit.enemy}"></li>
					<li class="mission-node" th:text="${arbit.node}"></li>
					<li class="mission-etc" th:text="${arbit.etc}"></li>
				</ul>
			</td>
			<td style="width: 20%;"><img th:src="@{'img/faction/' + ${arbit.enemy} + '.png'}" alt="阵营图标"/></td>
		</tr>
	</table>
</div>

</body>
</html>
